其實原本不是要叫這個名字的。原本要叫《官網沒教你的「如何把 Vue 寫好」》但是太狂了，竟然敢代替官網教你寫 Vue.js，後來想叫《Chris 的 Vue.js 奇怪寫法》但是這樣又太奇怪了，所以認真的想了一個名字。XDD

去年原本要寫這一系列，可以看我去年的完美 camp 進化論中的最後一篇有提到這件事。想不到今天順利的把它寫完了。

這些寫法經過一年的磨鍊，有一些更成熟了，有一些還只是雛形，我想我需要的是與別人討論。所以才有想寫這一系列文章，分享一下我在 Vue.js 上關於 options 寫法的想法與心得。當然都是一些自己主觀的想法與習慣造成的結果，它有它的好，也有它的不好

不過我自己的想法，如同我第一天在 facebook 上講的一樣

今年我又參加鐵人了，這一次要分享我用 Vue.js 的壓箱底，留一手的人是不會進步的，唯有每一次的掏空自己擅長的一切，才會準備足夠重新學習新技能的動力。

因為我相信工程師的價值在於「我為什麼這麼做」，而不是「我做了什麼」。也就是說這些招式與方法可以學走，但是真正有價值的地方是，為什麼要這麼做，了解為什麼，才能確保方法在演化的過程中，有一個方向，而不是隨機變化，甚至走倒退路的做法。(也許我正在走倒退路！XDD) 不過保持著一個心法，才能讓自己在技術選擇上，有著相對正確的方向。

系列目錄

開場文

• 這是一趟把 Vue 從需求、觀念到功能貫串起來的旅程

自定義 Comopnent 開始，才是開始用 Vue.js

借鑑 functional programming

• pure function
• pure component
• Component 的 Component (不是遞迴)

特殊的百變 component

• Component 鬼牌(一): 看 props 決定 Component
• Component 鬼牌(二): 看網址決定 Component

v-model 的偏好與使用習慣

• 捨棄偽雙向綁定 v-model
• 深入淺出 Computed
• 用 watch 搭配服用 immutable

管好 Axios 管好 API

axios 寫成 API Doc 自我文件化

• 處理 API 層次感之地基篇
• 讓程式碼化為 API Doc

有上傳檔案的使用方式

• 用兩支 API 實作新增資料與上傳檔案

Vuex 篇

我使用 Vuex 的觀念

• 統一狀態管理 + 單一資料流
• 存放資料的 state、module
• Vuex 的使用偏好
• 不要在 mutation 加工 API 回來的資料
• 用 event 來準備傳給後端的 data

細說 vuex偏好

• getters 就是欲望
• actions 就是 Vuex 裡「共用的 method」
• 拆掉 v-model + computed get/set 到 vuex

剩下還沒說，但基礎又很重要的

Vue comopnent 的所有 lifecycle 與 Vue Router

• 載入頁面，什麼時候發 API 適合？
• 其它的 lifecycle 或 vue router 的 hook

進階心法篇

資料驅動設計 component 篇

• 表單攻略前準備
• 新增表單/編輯表單，共用？或分開？
• 表單: 處理物件型資料的畫面
• 表單處理 Object 裡的 Object
• 表單處理 Object 裡的 Array
• 後端說修改時只需要送「有修改的欄位」過來
• 表格元件共用攻略

希望可以獲得大家各自習慣的寫法。
以及不會讓這些成為別人的線上課程內容。